<template>
	<view class="container page">
		<Header :isBack="true">
			<block slot="content">平台举报</block>
		</Header>

		<view class="item">
			<view class="type">
				<view class="text text1">标题：</view>
				<input class="input1" placeholder="请输入标题" v-model="title" />
			</view>

			<view class="type">
				<view class="text text1">举报内容：</view>
				<textarea class="input1 textarea" placeholder="请输入举报内容" v-model="detail" />
			</view>
			<view style="height: 220rpx;"></view>
			<view class="bottom">
				<!-- <view class="agree-files-content">
					<view class="remember" @tap="agree">
						<checkbox-group>
							<label>
								<checkbox value="cb" :checked="checked" class="remember-input" />请确认已阅读并接受
							</label>
						</checkbox-group>
					</view>
					<navigator class="forget" url="/pages6/pages/docs/service-contract">
						《房屋出售授权协议》
					</navigator>
				</view> -->
				<view class="fixed-tijiao">
					<view @tap="clickConfirm">提 交</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: '',
				detail: ''
			};
		},

		components: {

		},

		onLoad: function() {

		},

		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				});
			},

			// 提交表单
			async clickConfirm() {
				let that = this;
				//判断是否登录
				let result = that.$api.isLogin();
				if (result === false) {
					return false;
				}

				// if (this.checked === false) {
				// 	this.$api.msg('请先同意授权协议！')
				// 	return false;
				// }

				if (!that.title) {
					that.$api.msg('请输入标题！');
					return false;
				}

				if (!that.detail) {
					that.$api.msg('请输入举报内容！');
					return false;
				}

				this.$api.msg('举报成功！');
				setTimeout(() => {
					uni.redirectTo({
						url: '/pages4/pages/company-set/company-set'
					})
				}, 1500)
			},
		},
	}
</script>

<style lang="scss">
	page {
		font-size: 30rpx;
		// padding-right: 5rpx;
	}

	.container {
		// #ifdef APP-PLUS
		padding-top: 160rpx;
		// #endif

		// #ifdef MP-WEIXIN
		padding-top: 160rpx;
		// #endif

		// #ifdef H5
		padding-top: 100rpx;
		// #endif
	}

	.bottom {
		position: fixed;
		bottom: 0rpx;
		z-index: 199;
		width: 100%;
		height: 190rpx;
		background-color: white;
	}

	.item {
		.type {
			display: flex;
			align-items: flex-start;
			margin-left: 30rpx;
			margin-top: 20rpx;
			flex-wrap: wrap;

			.text {
				letter-spacing: 2rpx;
				font-size: 28upx;
				height: 70rpx;
				line-height: 70rpx;
				width: 22%;
			}

			.input1 {
				background-color: #f5f5f5;
				padding: 20rpx;
				height: 70rpx;
				width: 75%;
				font-size: 28rpx;
			}

			.textarea {
				height: 200rpx;
			}

			.icon {
				width: 30rpx;
				height: 30rpx;
				margin-top: 5rpx;
				margin-right: 10rpx;
				margin-left: 10rpx;
			}

			.btn {
				color: #999999;
				background-color: #f7f7f7;
				text-align: center;
				border-radius: 10rpx;
				margin-left: 20rpx;
				padding: 10rpx;
				margin-top: 10rpx;
				font-size: 28upx;
			}

			.add {
				width: 200rpx;
				height: 200rpx;
			}

			.add-btn {
				display: flex;
				height: 100%;
				width: 80%;
				flex-wrap: wrap;
			}

			.text2 {
				// margin-top: 20rpx;
			}
		}

		.type1 {
			display: flex;
			margin-left: 10rpx;
			// margin-top: 10rpx;
		}

		.typeBottom {
			width: 90%;
			margin: 20rpx auto;
			background-color: #f5f5f5;
			border-radius: 10rpx;
			height: 100rpx;
			display: flex;
			align-items: center;



			.type-didian {
				flex: 1;
			}

			.right {
				width: 14rpx;
				height: 24rpx;
				margin-right: 30rpx;
			}
		}
	}

	.fixed-tijiao {
		position: absolute;
		top: 50upx;
		height: 80upx;
		width: 90%;
		margin-left: 5%;
		background-color: rgb(243, 67, 26);
		border-radius: 6upx;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #fff;
	}
</style>